.tag-modal {
  .cu-timeline {
    .cu-tag {
      color: @white;
      padding: @size * .05  @size * .1;
      border-radius: @size * .05;
    }
  }
}
.container.user-edit {
    width: 100%;
    height: e('calc(100% - 50px)');
    position: relative;
    overflow: hidden;
    .user-main {
      height: 100%;
      .flexBetween();
      align-items: flex-start;
    }
    .info-one {
      padding: @size * .1;
      border-radius: @size * .5 !important;
      overflow: hidden;
      .row {
        display: flex;
        &.one {
          li {
            width: 50%;
            img {
              width: 100%;
            }
          }
        }
      }
    }
    .info-two {
      display: flex;
      flex-wrap: wrap;
      .l {
        display: flex;
        align-items: center;
        justify-content: center;
        height: @size * 1.8;
        img {
          width: @size * 2;
          cursor: pointer;
        }
      }
      >div {
        width: 33%;
      }
    }
    .left {
      width: e('calc(50% - 20px)');
      margin-right: @space;
      height: 100%;
      .info {
        padding: @space * 2;
        padding-top: 0;
        position: relative;
        .flexLeft();
        .avatar {
          width: @size * .7;
          height: @size * .7;
          margin-right: @space;
          .border();
          .radius(50%);
          background-color: @white;
          user-select: none;
          overflow: hidden;
          cursor: pointer;
          .flexCenter();
          position: relative;
          &:hover {
              .tip {
                  opacity: 1;
              }
          }
          img {
              max-width: 100%;
              max-height: 100%;
          }
          .tip {
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              font-size: 14px;
              opacity: 0;
              color: @white;
              background-color: @bg-dark;
              position: absolute;
              .flexCenter();
          }
        }
      }
      .item {
        margin-bottom: @space;
        padding-left: @space * 2;
        .icon {
          width: @space * 2;
          margin-right: @space;
          text-align: center;
          vertical-align: middle;
        }
      }
    }
    .integral {
      padding: @space;
      .flexLeft();
      flex-wrap: wrap;
      .i-item {
        margin: 0 @space / 2 @space;
        height: @size * .7;
        border: 1px solid #ddd;
        .radius(@space / 2);
        .flexCenter();
        justify-content: flex-start;
        flex: 0 1 48%;
        overflow: hidden;
        cursor: pointer;
        .l {
          width: @size * .7;
          margin-right: @space / 2;
          height: 100%;
          .flexCenter();
          img {
            width: 54px;
            height: 54px;
          }
        }
        .x-big {
          font-weight: bold;
          color: #000;
        }
        p, img {
          vertical-align: middle;
        }
        p > img {
          margin-left: @space / 2;
        }
        &.red > .l {
          background-color: #FF5858;
        }
        &.yellow > .l{
          background-color: #FFA046;
        }
        &.blue > .l{
          background-color: #32A7FF;
        }
      }
    }
    .right {
      width: 50%;
      height: e('calc(100% - 20px)');
      .outer {
        height: e('calc(100vh - 250px)');
      }
    }
}
